CREATING TOOLBARS IN VISUALBASIC -------------------------------- By Stephen Murphy CIS 70661,2461 This is intended for new users of VisualBasic who would like to add some additional flair to thier programs. Adding a toolbar is a nice touch, and it is not hard to do. Your finished toolbar can look as good, and be just as functional as the ones found in Microsoft Excel and other first class professional programs. Adding a toolbar requires no add-ons to VisualBasic. You can do it all using VisualBasic and Paintbrush. Creating the bar ---------------- The toolbar itself is a Picture Box with it's background color set to light grey. It doesn't have to be grey, but this seems to be the standard color. It's border style should be set to 1-Fixed Single. Creating the buttons -------------------- Within the bar (picture box) you have just created, create another picture box. That is to say, use the mouse to draw the second box inside the first. If you just double-click on the picture box tool, the second picture box will be created as part of the Form rather than part of the first picture box. We want the second picture box to be contained within the first. You will be able to tell if you succeeded by selecting the new picture box and trying to move it; you should not be able to move it past the limits of the first picture box. Now set it's AutoSize property to True, and it's BorderStyle property to 0 - None. Drawing the buttons ------------------- Take a moment to look at the Windows buttons in front of you (on scroll bars, maximize buttons, etc.) You will notice they have a slight white hi-lite across the left and top, and a grey shadow across the bottom and right. When a button is pressed, this hi-lite and shadow disappear, giving the illusion of movement. This little illusion is simple but effective. The basic procedure is to create two pictures of each button you want. One will have the shadow and hi-lite, the other will not. When the user presses the Mouse button, quickly exhcange pictures, and it will look like the button has been pressed. To get a better idea, use Paintbrush to view a couple of the buttons from the ToolDemo program. You will notice they come in pairs: "blank_up.bmp" and "blank_dn.bmp". One is a bitmap of the button in the up position, the other is a bitmap of the button in the down position. To view a couple of these bitmaps use Paintbrush. Don't use the Open File commands to view them because that will give you a very small image that you can't even see. Rather, use the Edit Paste From command to paste them into an empty sheet. Paste in both the bitmaps "blank_up.bmp" and "blank_dn.bmp" and position them side by side on the screen so you can compare them. Use the View Zoom In command to get a good look at them. Notice the single line of white across the top and left, and the double line of dark grey across the right and bottom on the Up button. On the Down button, the white is replaced by black, and the dark grey shadow is simply removed. This little bit of shading creates the whole effect of the button being "up" or "down". When you add a picture to your button, the picture portion of the button has to move a little to the right and down in your second, "down" button. In other words, centre the picture on the button in the up position, and offset it a little on the down button. Paste in a couple of the buttons with pictures on them (such as "writ1_up.bmp" and "writ1_dn.bmp") and you will see what I mean. The picture has to move over and down a little to complete the effect. Saving your buttons in Painbrush -------------------------------- Once you have drawn your buttons (you can draw them side by side on the same page) and you're ready to try them out, you need to save them as separate bitmaps. To do this, you will use the Paintbrush Edit Copy To command. First select your square scissors tool. Move the cross-hairs just outside the top and left of your button. This part has to be exact since you only want to cut out your button, and not the rest of the background. Tap your cursor keys to move the cross-hairs right on the top-left corner of your button. You can tell you are right over the edge of the desired cut-out because the bottom and right cross-hairs will turn white. Then hold the mouse button down and use the cursor keys to move over and down to select the rest of your button. Again, we don't want to include any of the background in our button. You can tell when you are on the edge of your button because the dotted line of the selection box will turn white. In the case of the bottom and right sides however, you need to select one pixel beyond the point where the dotted lines turn white. Give your right and down cursor buttons one tap so the dotted line turns black again. Having selected your button without any background included, choose the Edit Copy To command to save the cutout to it's own bitmap file. Back in VisualBasic ------------------- We created our second Picture Box and set its AutSize property to True. This means the box will create its own size to accomodate the bitmap. Now, select its Picture property, and assign your new "up" button to it. Your button should appear in all its glory. Now we just have to add the code to activate the button. This is the easiest part. If you want a button that stays down after it has been clicked, assign the code to the Click procedure of the picture box that contains the button. If you want the button to pop up again after the user releases the mouse button, assign the code to the MouseDown and MouseUp procedures for the picture box that contains the button. The code for this second type of button is as follows: In the MouseDown event procedure, change the picture to your "down" button. For example, Picture2.Picture=LoadPicture("button_dn.bmp") In the MouseUp event procedure, change to the picture of your "up" button... Picture2.Picture=LoadPicture("button_up.bmp") That's all there is to it! If you want a button that stays down when clicked, place the picture assignment code in the Picture_Click event procedure along with a flag that keeps track of whether the button is currently up or down. Each time the button is clicked, it will go either up or down: If ButtonDownFlag = 0 Then Picture2.Picture=LoadPicture("button_dn.bmp") ButtonDownFlag = -1 Exit Sub ElseIF ButtonDownFlag = -1 Then Picture2.Picture=LoadPicture("button_up.bmp") ButtonDownFlag = 0 Exit Sub End IF Have a look at the code for the demo included here. It will give you an idea of how simple the process is, yet how effective the result can be. Of course don't forget to add the code to take the action which the button represents (like changing the screen color, for example). Conclusion ---------- The process outlined here might seem a little complex, but once you have gone through it it is quite simple and straight forward. My buttons in the demo are actually an array of picture boxes which makes them easier to respond to and position. Thier Index property determines which button was pressed, and a Select Case routine determines which picture to display where. If you only have a couple of buttons, though, you don't really need an array. The Form_Load procedure also does the work of positioning the toolbar on the form and aligning the buttons inside it. I do not profess to be a great programmer (reading through my code will tell you that!) but I just wanted to share with you this simple but effective method that doesn't require add-ons or additional purchases. As you can see, you are limited only by your imagination. Good luck. ----------------end-of-author's-documentation--------------- Software Library Information: This disk copy provided as a service of Public (software) Library We are not the authors of this program, nor are we associated with the author in any way other than as a distributor of the program in accordance with the author's terms of distribution. Please direct shareware payments and specific questions about this program to the author of the program, whose name appears elsewhere in this documentation. If you have trouble getting in touch with the author, we will do whatever we can to help you with your questions. All programs have been tested and do run. To report problems, please use the form that is in the file PROBLEM.DOC on many of our disks or in other written for- mat with screen printouts, if possible. PsL cannot debug pro- programs over the telephone, though we can answer questions. Disks in the PsL are updated monthly, so if you did not get this disk directly from the PsL, you should be aware that the files in this set may no longer be the current versions. Also, if you got this disk from another vendor and are having prob- lems, be aware that some files may have become corrupted or lost by that vendor. Get a current, working disk from PsL. For a copy of the latest monthly software library newsletter and a list of the 4,000+ disks in the library, call or write Public (software) Library P.O.Box 35705 - F Houston, TX 77235-5705 1-800-2424-PSL MC/Visa/AmEx/Discover Outside of U.S. or in Texas or for general information, Call 1-713-524-6394 PsL also has an outstanding catalog for the Macintosh.